import React from 'react';
import { BrowserRouter as Router, Route, Switch } from 'react-router-dom';
import Login from './pages/Login';
import Layout from './pages/Layout';
import AuthRoute from './component/AuthRoute';
import TestPage from './pages/Test';
export default class App extends React.Component {
  render() {
    return (
      <Router>
        <div className="App">
          {/* 在react中不会像vue那样自动匹配到第一个就会停止匹配，react需要使用Switch匹配第一个停止匹配 */}
          <Switch>
            {/* exact 精确匹配 一般情况使用 Redirect都会带上exact */}
            {/* Route 组件设置的component组件自动配置 history等porps */}
            {/* <Redirect from="/" to="/login" exact></Redirect> */}
            {/* 使用模糊匹配，可以匹配任意路由，这里主要用来匹配layout中得二级路由 */}

            {/* 使用render代替component */}
            <Route path="/test" component={TestPage}></Route>
            <Route path="/login" component={Login}></Route>
            <AuthRoute path="/" component={Layout}></AuthRoute>
          </Switch>
        </div>
      </Router>
    );
  }
}
